.txn_detail {
    .tnx_detail_wrap {
        border-top: .2667vw solid var(--main-split);

        .detail {
            position: relative;
            margin: var(--m12) var(--m16) var(--m20);
            border-radius: var(--m12);
            padding: var(--m16);
            background: var(--input-bg);
            backdrop-filter: blur(17.5PX);

            .arrow {
                height: var(--m20);
                margin: var(--m2) 0 var(--m2) var(--m6);
                align-self: flex-start;
            }

            .obj {
                height: 100%;
                display: flex;
                flex-direction: column;
                justify-content: space-between;
            }



            .address {
                display: flex;
                align-items: center;

                .avatar {
                    margin-right: var(--m12);
                    width: var(--m32);
                    height: var(--m32);
                    border-radius: 50%;
                    overflow: hidden;

                    img {
                        display: block;
                        width: 100%;
                        width: 100%;
                    }
                }

                .address_wrap {
                    span {
                        &:first-child {
                            font-style: normal;
                            font-weight: 400;
                            font-size: var(--m10);
                            display: flex;
                            align-items: center;
                            color: #A5A5AB;
                        }

                        &:last-child {
                            font-family: 'Montserrat-Light';
                            font-style: normal;
                            font-weight: 300;
                            font-size: var(--m11);
                            /* identical to box height */

                            display: flex;
                            align-items: center;

                            /* 深黑 */

                            color: #2A2A2C;
                            margin-top: var(--m2);
                        }
                    }
                }
            }
        }

        .description {
            font-family: 'Montserrat-Light';
            .drive {
                margin: 0 var(--m16);
                height: 1PX;
                transform: translateY(0.5);
                background-color: #0F0F10;
                margin-bottom: var(--m10);
            }

            .desc {
                margin: 0 var(--m16) var(--m8);
                display: flex;
                justify-content: space-between;
                align-items: center;
                font-style: normal;
                font-weight: 700;
                font-size: var(--m11);
                color: #2A2A2C;

                .sub {
                    font-size: var(--m11);
                    font-weight: 300;
                    color: #59595F;
                }

                .strong {
                    color: var(--font-color);
                    font-weight: 600;
                }

                .total_sub {
                    font-weight: 500;
                    font-size: var(--m11);
                    color: var(--font-color);
                    font-family: Montserrat-Medium;
                }

                .total_amount {
                    display: flex;
                    align-items: center;
                    font-weight: 500;
                    font-size: var(--m11);
                    color: #2A2A2C;
                    font-family: Montserrat-Medium;
                }
                .coinName {
                    margin: 0 var(--m4);
                }
            }
        }


        .view {
            display: inline-block;
            font-style: normal;
            font-weight: 600;
            align-items: center;
            justify-content: center;
            text-decoration-line: underline;
            color: var(--main-text);

            text-transform: capitalize;

            img {
                width: var(--m16);
                height: var(--m16);
                margin-left: var(--m4);
            }
        }
    }


    .success {
        color: #3BD7D1 !important;
        font-family: Montserrat-Regular;
    }

    .fail {
        color: var(--error) !important;
        font-family: Montserrat-Regular;
    }

    .padding {
        color: var(--padding) !important;
        font-family: Montserrat-Regular;
    }

    .btn {
        width: 68.266vw;
        height: var(--m44);
        margin: var(--m30) auto;
        font-family: Montserrat-Medium;
        background: linear-gradient(360deg, #4F48E2 0%, #6B65E9 100%);
        border-radius: var(--m12);
        opacity: 1;
        font-size: var(--m14);
        font-weight: 500;
        line-height: var(--m44);
        color: #FFFFFF;
        text-align: center;
    }
}



@media screen and(min-width:1280px) {
    .txn_detail {
        .tnx_detail_wrap {
            border-top: 1.2535px solid var(--main-split);

            .detail {
                margin: var(--pc12) var(--pc16) var(--pc20);
                border-radius: var(--pc12);
                padding: var(--pc16);
                background: var(--input-bg);

                .arrow {
                    height: var(--pc20);
                    margin: var(--pc2) 0 var(--pc2) var(--pc6);
                }

                .obj {
                    height: 100%;
                }



                .address {
                    .avatar {
                        margin-right: var(--pc12);
                        width: var(--pc32);
                        height: var(--pc32);
                    }

                    .address_wrap {
                        span {
                            &:first-child {
                                font-size: var(--pc10);

                            }

                            &:last-child {
                                font-size: 15.04px;
                                margin-top: 2.5065px;
                            }
                        }
                    }
                }
            }

            .description {
                .drive {
                    margin: 0 var(--pc16);
                    margin-bottom: var(--pc10);
                }

                .desc {
                    margin: 0 var(--pc16) var(--pc8);
                    font-size: var(--pc11);
                    .sub {
                        font-size: var(--pc11);
                    }

                    .total_sub {
                        font-size: var(--pc11);
                    }

                    .total_amount {
                        font-size: var(--pc11);
                    }
                    .coinName {
                        margin: 0 var(--pc4);
                    }
                }
            }


            .view {
                img {
                    width: var(--pc16);
                    height: var(--pc16);
                    margin-left: var(--pc4);
                }
            }
        }
        .btn {
            width: 320px;
            height: var(--pc44);
            line-height: var(--pc44);
            margin: var(--pc30) auto;
            border-radius: var(--pc12);
            font-size: var(--pc14);
        }
    }

}